<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ page import="java.util.List" %>
<%@ page import="org.jbpm.api.ProcessInstance" %>
<%@ page import="org.asdmp.restday.service.ParallelService"%> 
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JBPM Console</title>
<link href="../css/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../js/jquery-1.11.1.min.js"></script>
</head>
<body onload="drawworkflow()">
<div id="wrapper">
        <jsp:include page="../include/header_wide.jsp" /> 
            <!-- end div#header -->
            <div id="page_wide">
                <div id="content">
                    <div id="welcome">
                        <h2></h2>
                        <!-- Fetch Rows -->
                        <center>
                        <form id="submitform" name="submitform" method="post" action="../controller/redParallelGetTaskController">
                        	流程实例：<select name="processInstanceId" id="processInstanceId">
			                            <% ParallelService service = new ParallelService();
			                            	List<ProcessInstance> list =  service.listAllProcessInstances();
			                               String processInstanceId =request.getAttribute("processInstanceId")==null?"":request.getAttribute("processInstanceId").toString();
			                               if (list != null) {
			                               for (ProcessInstance p :list){
			                            	  if (p.getId().contains("parallel")){
			                              	%>
			                        		<option value="<%= p.getId()%>"><%= p.getId()%></option>
			                        	<%}}} %>
			                       	</select>
                        <input type="hidden" name="fromnodes" id="fromnodes" value="<%= request.getAttribute("fromnodes") %>">
                        <input type="hidden" name="nodes" id="nodes" value="<%= request.getAttribute("nodes") %>">
                        	审批事项：<select name="paratask" id="paratask">
                        	<option value="审批事项一">审批事项一</option>
                        	<option value="审批事项二">审批事项二</option>
                        	<option value="审批事项三">审批事项三</option>
                        </select>
                        </form>
                         <%=request.getAttribute("responseText")%><br/>
						 <%=request.getAttribute("fromnodes")%><br/>
						 <%=request.getAttribute("nodes")%>	<br/>
                        <img id="img1" alt="" src="../image/parallel.png" style="display:none">
                        <img id="img2" alt="" src="../image/parallel_red.png" style="display:none">
                        <!--  request.getAttribute("responseText") %><br/>
						 request.getAttribute("fromnode") <br/>
						 request.getAttribute("node")	<br/>-->
                        <canvas id="canvas" width="1100" height="500" style="background:white"></canvras>			
                        </center>
                    </div>
                    <!-- end div#welcome -->
                </div>
                <!-- end div#content -->
                <div id="sidebar">
                    <!--ul-->
                    	<jsp:include page="../include/redparallelnav.jsp"/>
                        <!-- end navigation -->
                        <jsp:include page="../include/updates.jsp"/>
                    <!--/ul-->
                </div>
                <!-- end div#sidebar -->
                <div style="clear: both; height: 1px"></div>
            </div>
            <jsp:include page="../include/footer_wide.jsp" />
        </div>
        <!-- end div#wrapper -->
<script type="text/javascript">
function drawworkflow(){
	 var nodes = "<%=request.getAttribute("nodes")%>";
	 var fromnodes = "<%=request.getAttribute("fromnodes")%>";
	 var nodesSet =  nodes.split(",");
	 var fromnodesSet = fromnodes.split(",");
	 
	 var ctx = $("#canvas").get(0).getContext("2d");
	 ctx.clearRect(0,0,1100,500);
	 ctx.drawImage(document.getElementById("img1"),0,0);
	 
	 if (fromnodesSet.length == 1 && nodesSet.length == 1 && !fromnodes.indexOf("审批事项", 0)&& !nodes.indexOf("审批事项", 0)){ 
		 for(var i = 0; i< nodesSet.length;i++){
			 drawNodes(ctx,fromnodes,nodes);
		 }
	 }else{
		 for(var i = 0; i< nodesSet.length;i++){
			 //alert(nodesSet[i]);
			 drawNodes(ctx,nodesSet[i],nodesSet[i]);
		 }
	 }
}

function drawNodes(ctx,fromnode,node){
	 if ((fromnode == "[开始]"&&node=="[前置审批]") || (fromnode == "开始"&&node=="前置审批") ){
		 ctx.drawImage(document.getElementById("img2"),94,198,140,48,94,198,140,48);
	 }
	 else if ((fromnode == "[总经理审批]" &&node=="[结束]")||(fromnode == "总经理审批" &&node=="结束")){
			ctx.drawImage(document.getElementById("img2"),734,200,141,47,734,200,141,47);
		 }
	 else if ((fromnode == "[前置审批]" &&node=="[前置审批]")||(fromnode == "前置审批" &&node=="前置审批")){
		ctx.drawImage(document.getElementById("img2"),152,202,83,43,152,202,83,43);
	 }
	 else if ((fromnode == "[审批事项一]" &&node=="[审批事项一]")||(fromnode == "审批事项一" &&node=="审批事项一")){
			ctx.drawImage(document.getElementById("img2"),388,96,82,44,388,96,82,44);
	 }
	 else if ((fromnode == "[审批事项二]" &&node=="[审批事项二]")||(fromnode == "审批事项二" &&node=="审批事项二")){
			ctx.drawImage(document.getElementById("img2"),385,198,82,44,385,198,82,44);
	}
	 else if ((fromnode == "[审批事项三]" &&node=="[审批事项三]")||(fromnode == "审批事项三" &&node=="审批事项三")){
			ctx.drawImage(document.getElementById("img2"),388,298,82,44,388,298,82,44);
	}
	 else if ((fromnode == "[总经理审批]" &&node=="[总经理审批]")||(fromnode == "总经理审批" &&node=="总经理审批")){
		ctx.drawImage(document.getElementById("img2"),651,202,82,44,651,202,82,44);
	 }
}


function redParallelCreateInstance(){
	$("#submitform").attr("action","../controller/redParallelCreateInstanceController");
	$("#submitform").submit();
}

function redParallelCompleteTask(){
	$("#submitform").attr("action","../controller/redParallelCompleteTaskController");
	$("#submitform").submit();
}

</script>
</body>
</html>
